/**
 * 页面中复用的数据和逻辑
 */
import { ref, onMounted } from 'vue'
import { findBanner } from '@/api/home'
import { useCountDown } from '@/hook'
import schema from '@/utils/vee-validate-schema'
import Message from '@/components/Message'

// 获取轮播图数据
export function useBanner () {
  const sliders = ref([
    // {
    //   hrefUrl: '/#/',
    //   id: '630000201807155635',
    //   imgUrl: 'http://zhoushugang.gitee.io/erabbit-client-pc-static/images/b1.jpg'
    // },
    // {
    //   hrefUrl: '/#/',
    //   id: '650000201207058528',
    //   imgUrl: 'http://zhoushugang.gitee.io/erabbit-client-pc-static/images/b2.jpg'
    // }
  ])
  const getBannerList = async () => {
    const { result } = await findBanner()
    // console.log(result)
    sliders.value = result
  }
  onMounted(() => {
    getBannerList()
  })
  return { sliders }
}

// 发送验证码
/**
 *
 * @param {*} formData 表单数据
 * @param {*} fm 表单组件实例
 * @param {*} sendCodeApi 发短信后台接口方法
 * @returns
 */
export const useSendCode = (formData, fm, sendCodeApi) => {
  const { count, start } = useCountDown(60)
  /**
   * 思路：
   * 1. 引入倒计时方法
   * 2. 定义发短信的事件回调函数
   *    1. 校验手机号对不对(单独做)
   *    2. 如果手机号正确，还要确保60s之内只能发一次
   * 3. 调用接口发送
   */
  // 点击事件回调函数
  const send = async () => {
    // 不走表单，单独使用schema的校验函数
    const valid = schema.mobile(formData.mobile)
    if (valid === true) {
      // 校验通过 && 没有开始倒计时（60s之内发一次）
      if (count.value === 0) {
        await sendCodeApi(formData.mobile)
        Message({ type: 'success', text: '短信发送成功！' })
        // 调用成功开始倒计时
        start()
      }
    } else {
      // 校验失败（valid错误信息）=>手动触发显示错误信息
      fm.value.setFieldError('mobile', valid)
    }
  }
  return { count, send }
}
